<div class="box-page-container">
  <div class="box-page-header">
    <div class="title">Создание группы</div>
    <div class="other-controls right">
    </div>
  </div>
  <div class="box-page-body">
    <div class="box-message" id="message" style="display: none;"></div>
    <?php echo $this->form ?>
    <div class="caption">Доступ для группы: </div>
    <?php if (count($this->resources) <= 0): ?>
    	<div class="box-message" id="message" style="display: block;">Не создано ни одного ресурса</div>
    <?php else: ?>
    <table class="table" id="access-list">
      <thead>
        <tr>
          <th width="25px">ID</th>
          <th width="120px">Ключевое имя</th>
          <th width="230px">Описание</th>
          <th width="200px">Модуль</th>
          <th width="120px">Действие</th>
          <th width="30px"></th>
        </tr>
      </thead>
      <tbody>
        <?php foreach ($this->resources as $resource): ?>
          <tr id="<?php echo $resource->id ?>">
            <td><?php echo $resource->id ?></td>
            <td><?php echo $resource->name ?></td>
            <td><?php echo $resource->description ?></td>
            <td><?php echo $resource->findParentRow('Model_Module')->title ?></td>
            <td><?php echo $resource->action ?></td>
            <td><input type="checkbox" /></td>
          </tr>
        <?php endforeach;?>
      </tbody>
    </table>
    <?php endif; ?>
  </div>
  <div class="box-page-footer">
    <div class="box-controls">
      <div class="right">
       	<div class="btn"><button onclick="create(this); return false;" class="primary">Создать</button></div>
      </div>
      <div id="progress" class="progress ajax-preloader-base"></div>
      <div id="control_text" class="box-controls-text"></div>
      <div class="clear-fix"></div>
    </div>
  </div>
  <div class="clear-fix"></div>
</div>
<style>
input[type="text"] {
  width: 230px;
}
</style>
<script src="/js/jquery/jquery.js"></script>
<script>
$('.form #key').keyup(function(){
	var val = $(this).val();
	var message = '';
	if (!val) {
		message = '<span style="color: red;">Пожалуйста, укажите ключевое имя группы!</span>';
	}
	var regexp = /^[a-z0-9_]*$/i;
	if (!regexp.test(val)) {
		message = '<span style="color: red;">Не верный формат ключевого имени группы! Доступен только английский алфавит, цифры и знак "-"</span>';
	}
	$('#key-element .description').html(message);
});
$('.form #title').keyup(function(){
	var val = $(this).val();
	var message = '';
	if (!val) {
		message = '<span style="color: red;">Пожалуйста, укажите заголовок для группы!</span>';
	}
	var regexp = /^[a-zа-я0-9_\-\.]*$/i;
	if (!regexp.test(val)) {
		message = '<span style="color: red;">Не верный формат заголовка! Доступен английский, русский алфавиты, цифры и знаки "-", "_", "."</span>';
	}
	$('#title-element .description').html(message);
});
$('.form #description').keyup(function(){
	var val = $(this).val();
	var message = '';
	if (!val) {
		message = '<span style="color: red;">Пожалуйста, укажите описание для группы!</span>';
	}
	var regexp = /^[a-zа-я0-9_\s\-\.]*$/i;
	if (!regexp.test(val)) {
		message = '<span style="color: red;">Не верный формат описания! Доступен английский, русский алфавиты, пробел, цифры и знаки "-", "_", "."</span>';
	}
	$('#description-element .description').html(message);
});
function create(el) {
	var msgBox = goog.dom.getElement('message');
	var access = $('input[type="checkbox"]:checked', '#access-list');
	var key = goog.dom.getElement('key'),
		title = goog.dom.getElement('title'),
		description = goog.dom.getElement('description');
	if (!key.value) {
    	key.focus();
    } else if (!title.value) {
    	title.focus();
    } else if (!description.value) {
        description.focus();
    }
    if (!key.value || !title.value || !description.value) {
    	msgBox.innerHTML = '<p>Все поля обязательны для заполнения.</p>';
		fx = new goog.fx.dom.FadeInAndShow(msgBox, 200);
		fx.play();
		return false;
    }
	if (access.length <= 0) {
		msgBox.innerHTML = '<p>Пожалуйста, укажите доступ хотя бы для одного ресурса.</p>';
		fx = new goog.fx.dom.FadeInAndShow(msgBox, 200);
		fx.play();
		return false;
	}
	if (msgBox.innerHTML != '') {
		fx = new goog.fx.dom.FadeOutAndHide(msgBox, 200);
		fx.play();
		msgBox.innerHTML = '';
	}
	var accessId = [];
	access.each(function(){
		accessId.push($(this).parent().parent().attr('id'));
	});
	$.post('/cp/group/create.save', {
		'key': key.value,
		'title': title.value,
		'description': description.value,
		'access': accessId
	}, function(response){
		if (typeof response.status == 'string' && response.status == 'ok') {
			$('.box-page-body').html('<div class="box-message" id="message">Группа <b>' + title.value + '</b> создана. <a href="/cp/group">Перейти к списку групп</a> <a href="/cp/group/create">Создать еще группу</a>.</div>');
			$(el).hide();
		}
	});
}
</script>